<!DOCTYPE html>
<html>

<head>

<meta charset="utf-8" />
<title>国风汉服-我的购物车</title>
<!--导入核心文件-->
<script src="../bootstrap3/js/holder.js"></script>
<link href="../bootstrap3/css/bootstrap.css" rel="stylesheet"
	type="text/css">
<script src="../bootstrap3/jquery-1.9.1.min.js"></script>
<script src="../bootstrap3/js/bootstrap.js"></script>

<link href="../css/aaa.css" rel="Stylesheet" />
<script src="../js/aaa.js"></script>
<!-- 字体图标 -->
<link rel="stylesheet"
	href="../bootstrap3/font-awesome-4.7.0/css/font-awesome.css" />
<link rel="stylesheet" type="text/css" href="../css/layout.css" />
<link rel="stylesheet" type="text/css" href="../css/cart.css" />
<script src="../js/cart.js" type="text/javascript" charset="utf-8"></script>

</head>

<body>
	<!--头部-->
	<div class="s_nav">
		<div class="s_nav_box">
			<a class="s_logo photo" href="../index.html"></a>
			<nav class="s_nav_menu">
				<a class="default active" href="../index.html">首页</a> <a
					class="album" href="album.html">摄影</a> <a class="video"
					href="/video">视频</a> <a class="topic" href="/topic">问答</a> <a
					class="word" href="/word">文章</a> <a class="activity" href="/game">活动</a>

			</nav>
			<div class="def_search  header_user">

				<div class="user">
					<img class="head"
						src="https://pic.hanfugou.com/web/2018/11/20/11/2e3e6efa17ba4116941bd3d176ddc8df.jpeg_50x50.jpg">
					<nav class="dropdown_menu">
						<a class="item letter" href="password.html" target="im"> <i
							class="icon"></i>修改密码
						</a> <a class="item auth" href="userdata.html"> <i class="icon"></i>个人资料
						</a> <a href="upload.html" id="aUMain" class="item usermain"> <i
							class="icon"></i>上传头像
						</a> <a class="item tools" href="address.html"> <i class="icon"></i>收货管理
						</a> <a class="item exit" href="login.html"><i class="icon"></i>退出
						</a>
					</nav>
				</div>
				</a>

				<div class="appdown">
					APP下载
					<div class="appdownload">
						<div class="appdownload_btn">
							<a class="ios"
								href="https://itunes.apple.com/cn/app/id1065807878"
								target="_blank">iPhone下载</a> <a class="android"
								href="https://www.hanfuhui.cn/download" target="_blank">Android下载</a>
						</div>
						<img
							src="../image/2e3e6efa17ba4116941bd3d176ddc8df.jpeg_100x100.jpg"
							alt="">
					</div>
				</div>
				<a class="search_btn" onclick="location.href='/search'"></a>
			</div>
		</div>
	</div>
	<!--头部结束-->
	<!--导航 -->
	<!--分割导航和顶部-->
	<div class="clearfix"></div>
	<div class="col-md-12 top-nav">
		<div class="col-md-6">
			<ul class="nav nav-pills">
				<li><a href="#"></a></li>
				<li class="active"><a href="../index.html"><span
						class="fa fa-home"></span></a></li>
				<li><a class="gou" href="han_shopmall.html">商城</a></li>
				<li><a href="cart.html">购物车</a></li>
				<li><a href="news.html">资讯</a></li>
				<li><a href="culture.html">文化</a></li>
			</ul>

		</div>
		<div class="col-md-6">

			<form action="search.html" class="form-inline" role="form"
				style="float: right;">
				<div class="form-group">
					<input type="text" class="form-control" id="search" name="search"
						placeholder="请输入商品名称进行搜索">
				</div>

				<button type="submit" class="btn btn-default btn-sm">
					<span class="fa fa-search"></span>
				</button>
			</form>

		</div>
	</div>
	<!--导航结束-->
<div class="container">
		<div class="col-md-offset-1 col-md-10">

			<div class="panel panel-primary">
				<div class="panel-heading">
					<h3 class="panel-title">
						<span class="fa fa-shopping-cart"></span> 购物车
					</h3>
				</div>
				<div class="panel-body">
					<form role="form" method="GET" action="orderConfirm.html">
						<!--购物车表格开始-->
						<table class="cart-table" width="100%">
							<thead>
								<tr>
									<th width="8%"><input type="checkbox" class="ckall"
										onclick="checkall(this)" />全选</th>
									<th width="110"></th>
									<th width="29%">商品</th>
									<th width="11%">单价</th>
									<th width="15%">数量</th>
									<th width="11%">金额</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody id="cart-list" class="cart-body">
								<tr>
									<td><input type="checkbox" class="ckitem" /></td>
									<td><img
										src="../images/portal/12DELLXPS13-silvery/collect.png"
										width="110" /></td>
									<td>联想(Lenovo)小新Air13 Pro 13.3英寸14.8mm超轻薄笔记本电脑</td>
									<td>¥<span id="goodsPrice1">5298</span></td>
									<td><input type="button" value="-" class="num-btn"
										onclick="reduceNum(1)" /> <input id="goodsCount1" type="text"
										size="2" readonly="readonly" class="num-text" value="1">
										<input class="num-btn" type="button" value="+"
										onclick="addNum(1)" /></td>
									<td><span id="goodsCast1"></span></td>
									<td><input type="button" onclick="delCartItem(this)"
										class="cart-del btn btn-default btn-xs" value="删除" /></td>
								</tr>
								<tr>
									<td><input type="checkbox" class="ckitem" /></td>
									<td><img
										src="../images/portal/16LenovoYOGA900green/collect.png"
										width="100" /></td>
									<td>戴尔(DELL)XPS13-9360-R1609 13.3</td>
									<td>¥<span id="goodsPrice2">4988</span></td>
									<td><input type="button" value="-" class="num-btn"
										onclick="reduceNum(2)" /> <input id="goodsCount2" type="text"
										size="2" readonly="readonly" class="num-text" value="1">
										<input class="num-btn" type="button" value="+"
										onclick="addNum(2)" /></td>
									<td><span id="goodsCast2"></span></td>
									<td><input type="button" onclick="delCartItem(this)"
										class="cart-del btn btn-default btn-xs" value="删除" /></td>
								</tr>
								<tr>
									<td><input type="checkbox" class="ckitem" /></td>
									<td><img
										src="../images/portal/13LenovoIdeaPad310_silvery/collect.png"
										width="110" /></td>
									<td>戴尔(DELL)魔方15MF Pro-R2505TSS灵越</td>
									<td>¥<span id="goodsPrice3">4699</span></td>
									<td><input type="button" value="-" class="num-btn"
										onclick="reduceNum(3)" /> <input id="goodsCount3" type="text"
										size="2" readonly="readonly" class="num-text" value="1">
										<input class="num-btn" type="button" value="+"
										onclick="addNum(3)" /></td>
									<td><span id="goodsCast3"></span></td>
									<td><input type="button" onclick="delCartItem(this)"
										class="cart-del btn btn-default btn-xs" value="删除" /></td>
								</tr>
							</tbody>
						</table>
						<div class="total-bar">
							<a href="javascript:selDelCart()"
								class="cart-del-sel btn btn-default btn-xs">删除所选商品</a> <span
								class="pull-right">已选商品 <span id="selectCount">0</span>件
								总价¥ <span id="selectTotal">0</span>元

							</span>

						</div>
						<div>
							<span class="pull-right"> <input type="submit"
								value="  结  算  " class="btn btn-primary btn-lg link-account" />
							</span>
						</div>

					</form>
				</div>
			</div>

		</div>
</div>

	<!-----------------------------------------尾部区域----------------------------------------->
	<footer style="text-align: center;">
		<p>
			<a href="/" target="_blank">关于我们</a><i>|</i><a href="/"
				target="_blank">商家入驻</a><i>|</i><a href="/" target="_blank">入驻协议</a><i>|</i><a
				href="#" target="_blank">新手指南</a><i>|</i><a
				href="/copyright/?action=cooperation" target="_blank">商务合作</a><i>|</i><a
				href="" target="_blank">汉服荟</a>
		</p>
		<p class="copyright">
			<a href="/" class="ebs" target="_blank"></a>CopyRight ©2018
			珠海市达内汉服网络科技有限公司 版权所有 <a href="" target="_blank">粤ICP备14084884号-1</a>
			电话：0888-8888888
		</p>
	</footer>
	<!--页脚结束-->
	<script type="text/javascript">
		$(function() {
			//返回链接
			$(".link-account").click(function() {
				location.href = "orderConfirm.html";
			})
		})
	</script>
	<script type="text/javascript">
		$(document).ready(function() {
			showCartList();
		});

		function showCartList() {
			$
					.ajax({
						"url" : "../cart/list",
						"type" : "GET",
						"dataType" : "json",
						"success" : function(json) {
							var list = json.data;
							console.log("list.length=" + list.length);

							$("#cart-list").empty();

							for (var i = 0; i < list.length; i++) {
								var html = '<tr>'
										+ '<td>'
										+ '<input type="checkbox" name="cart_id" value="#{id}" class="ckitem" />'
										+ '</td>'
										+ '<td><img src="..#{image}" width="80%" /></td>'
										+ '<td>#{title}</td>'
										+ '<td>¥<span id="goodsPrice#{id}">#{price}</span></td>'
										+ '<td>'
										+ '<input type="button" value="-" class="num-btn" onclick="reduceNum(#{id})" />'
										+ '<input id="goodsCount#{id}" type="text" size="2" readonly="readonly" class="num-text" value="#{count}">'
										+ '<input class="num-btn" type="button" value="+" onclick="addCount(#{id})" />'
										+ '</td>'
										+ '<td>¥<span id="goodsTotalPrice#{id}">#{total_price}</span>.00</td>'
										+ '<td><input type="button" onclick="delCartItem(this)" class="cart-del btn btn-default btn-xs" value="删除"/></td>'
										+ '</tr><tr></tr>';

								html = html.replace(/#{id}/g, list[i].id);
								html = html.replace(/#{image}/g, list[i].image);
								html = html.replace(/#{title}/g, list[i].title);
								html = html.replace(/#{price}/g,
										list[i].newPrice);
								html = html.replace(/#{count}/g, list[i].count);
								html = html.replace(/#{total_price}/g,
										list[i].newPrice * list[i].count);

								$("#cart-list").append(html);
							}
						}
					});
		}

		function addCount(id) {
			var url = "../cart/add_count";
			var data = "id=" + id;
			$.ajax({
				"url" : url,
				"data" : data,
				"type" : "GET",
				"dataType" : "json",
				"success" : function(json) {
					// alert("OK");
					var c = parseInt($("#goodsCount" + id).val());
					c++;
					$("#goodsCount" + id).val(c);

					var p = parseInt($("#goodsPrice" + id).html());
					var tp = p * c;
					$("#goodsTotalPrice" + id).html(tp);
				},
				"error" : function() {
					alert("您的登录信息已经过期！请重新登录！");
					location.href = "login.html";
				}
			});
		}
	</script>
</body>

</html>


